<template>
	<view class="day-price">
		<block v-for="(item,index) in list" :key="index">
			<view class="p-box column">
				<block v-if="item.type===1">
					<view>满<text>{{item.day}}</text>天减</view>
					<view>￥<text>{{item.price}}</text></view>	
				</block>
				<block v-if="item.type===2">
					<view>满<text>{{item.day}}</text>天享</view>
					<view>￥<text>{{item.rate}}</text>折</view>
				</block>
			</view>
		</block>
	</view>
</template>
<script>
	export default {
		name: 'car-day-price',
		props: {
			list:{
				type:[Object,Array],
				default:[]
			}
		},
		data() {
			return {
			}
		},
		watch: {
			
		},
		computed: {
			
		},
		mounted(){
			
		},
		methods: {
			
		}
	};
</script>
<style>
	.day-price{
		font-size: 18rpx;
		display: flex;
		flex-direction: row;
		justify-content:flex-start;
		flex-wrap: wrap;
	}
	
	.day-price .p-box{
		text-align: center;
		color:#FFFFFF;
		display: flex;
		justify-content: row;
		margin-right: 10rpx;
		border-radius: 10rpx;
	}
	
	.day-price .column{
		padding: 2rpx 8rpx;
		flex-direction: column;
		margin-bottom: 20rpx;
	}
	
	.day-price .p-box view text{
		font-size: 24rpx;
		margin: 0rpx 2rpx;
	}
	
	.day-price .p-box view:first-child text{
		margin: 0rpx 4rpx;
	}
	
	.day-price .p-box:nth-child(1){
		background-color:rgba(255,66,66,0.5)
	}
	
	.day-price .p-box:nth-child(2){
		background-color:rgba(255,66,66,0.6)
	}
	
	.day-price .p-box:nth-child(3){
		background-color:rgba(255,66,66,0.7)
	}
	
	.day-price .p-box:nth-child(4){
		background-color:rgba(255,66,66,0.8)
	}
	
	.day-price .p-box:nth-child(5){
		background-color:rgba(255,66,66,0.9)
	}
</style>
